<template>
  <div>
    <div class="app-container calendar-list-container">
      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-position="left" label-width="100px">
        <el-row>
          <el-col :span="24">
            <a @click="back()">
              <span class="back-link"><svg-icon icon-class="ds-left-double-arrow" /> 返回</span>
            </a>
          </el-col>
          <el-col :span="24">
            <span class="viewTitle">编辑课程</span>
          </el-col>
          <el-col :span="11">
            <el-card class="box-card">
              <p class="form-header">
                <svg-icon icon-class="ds-person" />基础信息
              </p>
              <el-form-item label="名称" placeholder="请输入课程名称" prop="base_info.title" :rules="[ { required: true, message: '请输入课程名称', trigger: 'blur' },{ max: 20, message: '长度不能大于20个字符', trigger: 'blur' }]">
                <el-input v-model="ruleForm.base_info.title"></el-input>
              </el-form-item>
              <el-form-item label="课程分类" prop="base_info.essay_class.id" :rules="[{ required: true, message: '请选择课程分类', trigger: 'change' }]">
                <el-select v-model="ruleForm.base_info.essay_class.id" placeholder="请选择课程分类" class="course-select" @change="getClass3List(list.base_info.essay_class.id)">
                  <el-option-group
                    v-for="group in class2list"
                    :key="group.class_1_id"
                    :label="group.class_1_name">
                    <el-option
                      v-for="item in group.children"
                      :key="item.class_2_id"
                      :label="item.class_2_name"
                      :value="item.class_2_id">
                    </el-option>
                  </el-option-group>
                </el-select>
              </el-form-item>
              <el-form-item label="阶段" required>
                <el-row v-for="(moment,index) in ruleForm.base_info.stage" :key="index">
                  <el-form-item :prop="'base_info.stage.'+index+'.selectedStage'" :rules="[{ required: true, message: '请选择课程阶段', trigger: 'change' }]">
                    <el-cascader style="width:80%;"
                                 :options="class3list"
                                 @change="getChangeValue(index, moment.selectedStage)"
                                 :props="props"
                                 v-model="moment.selectedStage"
                                 separator="-"
                    ></el-cascader>
                    <span class="add-icon" v-if="index===0" @click="addItemMoment"><i class="el-icon-plus"></i></span>
                    <span class="add-icon" v-if="index!==0" @click="reduceItemMoment(index)"><i class="el-icon-minus"></i></span>
                  </el-form-item>
                </el-row>
              </el-form-item>
            </el-card>
          </el-col>
          <el-col :span="11" :offset="1">
            <el-card class="box-card">
              <p class="form-header">
                <svg-icon icon-class="ds-person" />推送规则
              </p>
              <el-form-item label="状态" prop="send_rule.status" :rules="[{ required: true, message: '请选择课程状态', trigger: 'change' }]">
                <el-radio-group v-model="ruleForm.send_rule.status">
                  <el-radio label="1">启用</el-radio>
                  <el-radio label="0">下架</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="缩略图">
                <span style="color:#ed8a94;cursor:pointer;margin-right:20px;" @click="showBanner">点击查看</span>
                <el-upload style="display: inline-block;" ref="upload"
                  class="upload-demo"
                  :action=uploadUrl
                  :data="uploadParams"
                  :on-preview="handlePreview"
                  :on-success="handleSuccess"
                  :before-upload="beforeAvatarUpload"
                  :limit="1"
                  :on-exceed="handleExceed"
                  :show-file-list="false"
                  :file-list="fileList">
                  <span style="color:#ed8a94;cursor:pointer;">重新上传</span>
                </el-upload>
              </el-form-item>
              <el-form-item label="推送时间">
                <el-row v-for="(time,index) in ruleForm.send_rule.send_time" :key="index">
                  <el-col :span="5" style="min-width:150px;">
                    <el-form-item
                      :prop="'send_rule.send_time.' + index + '.week'"
                      :rules="[
                        {required: false, type: '', message: '请输入0到100正整数'},
                        {pattern: /^(?:0|[1-9][0-9]?|100)$/, message: '请输入0到100正整数'}
                      ]"
                    >
                      孕 <el-input v-model="time.week" class="input-width" @blur="getChangeTime(index,time)"></el-input> 周，
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      :prop="'send_rule.send_time.' + index + '.day'"
                      :rules="[
                        {required: false, type: '', message: '请输入0到6正整数'},
                        {pattern: /^(?:0|[1-6])$/, message: '请输入0到6正整数'}
                      ]"
                    >
                      第 <el-input v-model="time.day" class="input-width" @blur="getChangeTime(index,time)"></el-input> 天
                    </el-form-item>
                  </el-col>
                  <span class="add-icon" v-if="index===0" @click="addItemSend"><i class="el-icon-plus"></i></span>
                  <span class="add-icon" v-if="index!==0" @click="reduceItemSend(index)"><i class="el-icon-minus"></i></span>
                </el-row>
              </el-form-item>
            </el-card>
          </el-col>
        </el-row>
      </el-form>
      <div class="tabs-content">
        <el-tabs type="border-card">
          <el-tab-pane class="background-grey">
            <span slot="label">图文</span>
            <div>
              <div class="essayContent">
                <UE :defaultMsg=list.essay_content :config=config ref="ue"></UE>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane label="测试题" >
            <div style="padding:15px;">
              <el-form :model="testForm" :rules="rulesTest" ref="testForm" label-width="100px" class="demo-ruleForm">
                <div class="question-item">
                  <div class="title">
                    <el-form-item class="essay"
                                  v-for="(domain, index) in testForm.essay_qu"
                                  :label="index + 1 + '、题目'"
                                  :key="domain.key"
                    >
                      <el-button class="remove-out" @click.prevent="removeSubject(domain)">x</el-button>
                      <el-form-item style="margin-left:-80px;"
                                    :prop="'essay_qu.' + index + '.qu_title'"
                                    :rules="[
                                  {required: true, message: '标题不能为空', trigger: 'blur'},
                                  {max: 100, message: '长度在 1 到 100 个字符', trigger: 'blur'}
                                  ]"
                      >
                        <el-input placeholder="0/100字" v-model="domain.qu_title"></el-input>
                      </el-form-item>
                      <div class="answer-wrap">
                        <div class="answer">
                          <div class="div-1">答案：</div>
                          <div class="div-2">
                            <el-form-item
                              v-for="(answer, list) in testForm.essay_qu[index].answer"
                              :label="labelIndex(list)"
                              :key="answer.key"
                              :prop="'essay_qu.' + [index] + '.answer.' + list + '.test_answer'"
                              :rules="[
                              {required: true, message: '选项不能为空', trigger: 'blur'},
                              {max: 80, message: '选项最大长度不能超过80个字符', trigger: 'blur'}
                              ]"
                            >
                              <el-input type="textarea" v-model="answer.test_answer" style="width:70%;"></el-input>
                              <el-button v-if="list!==0 && list!==1" @click.prevent="removeAnswer(answer, index, list)">删除</el-button>
                            </el-form-item>
                            <el-form-item>
                              <el-button class="answer-button" v-if="showAnswer[index]" @click="addAnswer(index,testForm.essay_qu[index].answer.length)">+</el-button>
                            </el-form-item>
                            <el-form-item class="checkbox"
                                          label="正确答案："
                                          :prop="'essay_qu.' + [index] + '.right'"
                                          :rules="{
                                type: 'array', required: true, message: '请选择一个正确答案', trigger: 'change'
                              }"
                            >
                              <el-checkbox-group v-model="domain.right" :max="2">
                                <el-checkbox  @change="domain.right= [labelIndex(checkItem)]"
                                              v-for="(check, checkItem) in testForm.essay_qu[index].answer.length"
                                              :label="labelIndex(checkItem)" :key="checkItem"
                                >
                                </el-checkbox>
                              </el-checkbox-group>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="description">
                          <div class="div-1">解析：</div>
                          <el-form-item
                            :prop="'essay_qu.' + index + '.analyze'"
                            :rules="[
                              {required: true, message: '解析不能为空', trigger: 'blur'},
                              {max: 300, message: '长度在 1 到 300 个字符', trigger: 'blur'}
                              ]"
                          >
                            <el-input type="textarea" v-model="domain.analyze"></el-input>
                          </el-form-item>
                        </div>
                      </div>
                    </el-form-item>
                    <el-button class="add-subject" @click="addSubject(testForm.essay_qu.length)">添加题目</el-button>
                  </div>
                </div>
              </el-form>
            </div>
          </el-tab-pane>
        </el-tabs>
        <div class="save-btn">
          <el-button type="primary" @click="submitForm('testForm')">保存</el-button>
        </div>
      </div>
    </div>
    <div class="mask" v-show="bannerFlag" @click="cancelBanner">
      <div>
        <img :src="banner" alt="">
      </div>
    </div>
  </div>
</template>
<style scoped>
  .back-link {
    display: block;
    padding: 0px 0 15px;
  }
  .normal-person {
    color: #4ebef6;
  }
  .high-person {
    color: #fc9336;
  }
  .text {
    font-size: 14px;
  }
  .box-card .el-form-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px #eee;
  }
  .box-card .el-form-item:last-child {
    border: none;
  }
  .box-card .el-form-item .el-row {
    line-height: 50px;
    border-bottom: solid 1px #eee;
  }
  .box-card .el-form-item .el-row:last-child {
    border: none;
  }
  .update-pass {
    float: right;
    font-size: 14px;
    font-weight: normal;
    color: #ff7357;
  }
  .item {
    margin-bottom: 18px;
  }
  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .pdl10 {
    padding-left: 10px;
  }
  .form-header {
    /* padding-left: 10px; */
    color: #606266;
    font-weight: 700;
  }
  .form-header svg {
    color: #ed8a94;
    font-size: 20px;
    margin-right: 10px;
  }
  .el-form-item__label {
    font-weight: normal;
  }
  .clearfix:after {
    clear: both
  }
  .el-card__header {
    background-color: #4fb1e2;
    color: #ffffff;
    line-height: 58px;
    padding: 0 10px 0 20px;
  }
  .el-card__header button {
    color: #ffffff;
    float: right;
    padding: 3px 0;
    margin: 15px 10px;
  }
  .el-card__header button i {
    font-size: 20px;
  }
  .el-card__header svg {
    font-size: 28px;
    float: right;
    padding: 3px 0;
    margin: 15px 5px;
    cursor: pointer;
  }
  .el-col:nth-child(3n){
    clear: right;
  }
  .back-link {
    color: #ed8a94;
    font-size: 14px;
  }
  .back-link svg {
    font-size: 12px;
  }
  .el-transfer-panel__body {
    height: 203px;
  }
  .el-transfer-panel__list.is-filterable {
    height: 149px;
  }
  .el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label {
    font-size: 14px;
  }
  .el-col {
    margin-bottom: 0px!important;
  }
  .el-checkbox-button__inner {
    border-left: 1px solid #dcdfe6;
    border-radius: 0!important;
    margin-right: 10px;
  }
  span.viewTitle{
    display: block;
    font-size:22px;
    margin:10px 0 30px 0;
    color:#4d4d4d;
  }
  .tabs-content{
    margin-top:50px;
  }
  .tabs-content .essayContent{
    width:900px;
    margin:0 auto;
    background:#fff;
    padding:20px 30px 20px;
  }
  .tabs-content .question-item{
    padding:10px 30px 30px;
    /*border-bottom:1px solid #e6e6e6;*/
  }
  .tabs-content .question-item:last-of-type{
    border-bottom:0;
  }

  .mask{
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    position:fixed;
    top:0;
    bottom:0;
    z-index:999;
  }
  .mask img{
    width:200px;
    height:200px;
    position:fixed;
    top:50%;
    left:50%;
    transform:translateX(-50%) translateY(-50%)
  }
  .overHide{
    overflow:hidden;
  }
  .input-width{
    width:80px;
  }
  span.add-icon{
    display: inline-block;
    width:28px;
    height:28px;
    color:#fff;
    background-color:#ed8a94;
    text-align: center;
    line-height:28px;
    font-size:18px;
    float:right;
  }
  .course-select{
    width:100%;
  }
  .box-card .el-form-item .el-row[data-v-01cddce4]{
    border-bottom:0;
  }
  .save-btn{
    text-align: center;
    margin:60px auto 0;
    padding-bottom:30px;
  }
  .save-btn .el-button{
    width:150px;
  }
  /* 测试题开始 */
  .essay:nth-child(1) {
    margin-top: 0;
  }
  .essay {
    position: relative;
    margin-top: 50px;
    padding-bottom: 50px;
    border-bottom: 1px solid #ccc;
  }
  .essay >>> label {
    width: auto!important;
  }
  .essay >>> .el-form-item__content{
    width: 90%;
    margin-left: 80px!important;
  }
  .essay .remove-out {
    position:absolute;
    right: -60px;
    top: 0;
  }
  .answer-wrap {
    position: relative;
    margin-left: -80px;
  }
  .answer-wrap:after,.answer:after {
    display: block;
    content: '';
    clear: both;
  }
  .answer-wrap > div{
    width: 45%;
    float: left;
    margin-top: 20px;
  }
  .answer-wrap .answer {
    padding-right: 20px;
    box-sizing: content-box;
    border-right: 1px solid #ccc;
  }
  .answer > div,.description > div {
    float: left;
    font-size: 14px;
    font-weight: 700;
    color: #606266;
    margin-left: 20px;
  }
  .answer > .div-2 {
    width: 75%;
    position: relative;
  }
  .answer > .div-2 div {
    margin-bottom: 20px;
  }
  .answer > .div-2 .checkbox {
    margin-left: -89px!important;
  }
  .answer .el-checkbox-group {
    margin-left: 22px;
    position: relative;
  }
  .answer .div-2 .el_input {
    width: 70%!important;
  }
  .answer >>> .el-form-item__content {
    width: 100%;
    margin-left: 40px!important;
  }
  .answer >>> .el-form-item__error {
    top: 55px!important;
  }
  .answer .checkbox >>> .el-form-item__error {
    top: 31px!important;
    left: 50px!important;
  }
  .answer-button {
    position: absolute;
    left: 30%;
    bottom: -20px;
  }
  .answer-wrap .description {
    margin-left: 20px;
    padding-left: 20px;
    box-sizing: content-box;
    border-left: 1px solid #ccc;
    margin-left: -1px;
  }
  .description >>> .el-form-item {
    width: 80%;
  }
  .description >>> .el-form-item__content {
    width: 100%;
    margin-left: 20px!important;
  }
  .description >>> textarea {
    min-height: 300px !important;
  }
  .add-subject {
    display: block;
    margin: 0 auto;
  }
  /* 测试题结束 */
</style>
<script>
  import { getClass2List, getLessonStageOne, getLessonStageTwo, essayDetail, updateLesson } from '@/api/science'
  import store from '@/store'
  import UE from '../../components/Ueditor/UE.vue'
  export default {
    components: { UE },
    data() {
      return {
        uploadUrl: process.env.BASE_API + '/backend/essay/upload-file',
        id: '',
        showAnswer: [true],
        defaultMsg: '测试',
        config: {
          initialFrameWidth: null,
          initialFrameHeight: 500
        },
        list: {
          'base_info': {
            'essay_class': {
              'id': ''
            }
          },
          'send_rule': {},
          'essay_content': '',
          'essay_qu': {}
        },
        class2list: [],
        fileList: [],
        uploadParams: { token: store.getters.token },
        ruleForm: {
          base_info: {
            title: '',
            essay_class: {
              id: '',
              name: ''
            },
            stage: []
          },
          send_rule: {
            status: '',
            status_text: '',
            banner: '',
            send_time: [
              { 'week': '',
                'day': ''
              }
            ]
          }
        },
        rules: {
          title: [
            { required: true, message: '请输入课程名称', trigger: 'blur' },
            { max: 20, message: '长度不能大于20个字符', trigger: 'blur' }
          ],
          class2name: [
            { required: true, message: '请选择课程分类', trigger: 'change' }
          ],
          courseStatus: [
            { required: true, message: '请选择课程状态', trigger: 'change' }
          ]
        },
        banner: '',
        bannerFlag: false,
        class3list: [],
        props: {
          value: 'value',
          label: 'label',
          children: 'class4list'
        },
        testForm: {
          essay_qu: [{
            qu_title: '',
            analyze: '',
            right: [],
            answer: [{
              test_answer: '',
              select_num: 'A'
            }, {
              test_answer: '',
              select_num: 'B'
            }]
          }]
        },
        rulesTest: {
        }
      }
    },
    created() {
      this.id = this.$route.params.id
      this.initData()
    },
    methods: {
      // 初始化数据 获取课程分类列表
      initData() {
        var meta = document.createElement('meta')
        meta.name = 'referrer'
        meta.content = 'no-referrer'
        document.getElementsByTagName('head')[0].appendChild(meta)
        getClass2List().then(response => {
          this.class2list = response.data
        })
        essayDetail({ id: this.id }).then(response => {
          this.list = response.data
          this.banner = response.data.send_rule.banner
          this.ruleForm.base_info = response.data.base_info
          this.ruleForm.send_rule = response.data.send_rule
          /* for (var item of this.ruleForm.send_rule.send_time) {
            item.week = JSON.parse(item.week)
            item.day = JSON.parse(item.day)
          }*/
          for (var moment of this.ruleForm.base_info.stage) {
            moment.selectedStage = [moment.level_3_id, moment.level_4_id]
          }
          for (var qu of this.list.essay_qu) {
            qu.right = [this.labelIndex(qu.right)]
          }
          this.testForm.essay_qu = this.list.essay_qu
          for (var num in this.list.essay_qu) {
            if (this.list.essay_qu[num].answer.length < 10) {
              this.$set(this.showAnswer, num, true)
            }
          }
          getLessonStageOne(Object.assign({}, { 'class_2_id': this.ruleForm.base_info.essay_class.id })).then(response => {
            this.class3list = []
            for (const index in response.data) {
              this.class3list.push({ 'value': response.data[index].id, 'label': response.data[index].class_name, 'class4list': [] })
              getLessonStageTwo(Object.assign({}, { 'class_3_id': response.data[index].id })).then(response => {
                for (const course4 of response.data) {
                  this.class3list[index].class4list.push({ value: course4.id, label: course4.class_name })
                }
              })
            }
          })
        })
      },
      getClass3List(class_2_id) {
        getLessonStageOne(Object.assign({}, { 'class_2_id': this.ruleForm.base_info.essay_class.id })).then(response => {
          this.class3list = []
          for (const index in response.data) {
            this.class3list.push({ 'value': response.data[index].id, 'label': response.data[index].class_name, 'class4list': [] })
            getLessonStageTwo(Object.assign({}, { 'class_3_id': response.data[index].id })).then(response => {
              for (const course4 of response.data) {
                this.class3list[index].class4list.push({ value: course4.id, label: course4.class_name })
              }
            })
          }
        })
      },
      getChangeValue(index, val) {
        var count = 0
        for (var item of this.ruleForm.base_info.stage) {
          if (item.selectedStage.toString() === val.toString()) {
            count++
          }
        }
        if (count > 1) {
          this.$message.warning('课程阶段已存在，请重新选择')
          this.ruleForm.base_info.stage[index].selectedStage = []
        }
      },
      // 推送时间失去焦点
      getChangeTime(index, time) {
        var count = 0
        for (var item of this.ruleForm.send_rule.send_time) {
          if (item.week === time.week && time.day === item.day) {
            count++
          }
        }
        if (count > 1) {
          this.$message.warning('此推送时间已存在，请重新输入')
          this.ruleForm.send_rule.send_time[index].week = ''
          this.ruleForm.send_rule.send_time[index].day = ''
        }
      },
      // 新增一个阶段
      addItemMoment() {
        var obj = { 'selectedStage': [] }
        var len = this.ruleForm.base_info.stage.length
        var moment = this.ruleForm.base_info.stage[len - 1]
        if (len < 5) {
          if (moment.selectedStage.length !== 0) {
            this.ruleForm.base_info.stage.push(obj)
          } else {
            this.$message({
              showClose: true,
              message: '请输入课程阶段',
              type: 'warning'
            })
          }
        } else {
          this.$message({
            showClose: true,
            message: '最多只能输入5个课程阶段',
            type: 'warning'
          })
        }
      },
      // 减少一个阶段
      reduceItemMoment(index) {
        this.ruleForm.base_info.stage.splice(index, 1)
      },
      // 新增一个推送时间
      addItemSend() {
        var obj = {
          'week': '',
          'day': ''
        }
        var len = this.ruleForm.send_rule.send_time.length
        var moment = this.ruleForm.send_rule.send_time[len - 1]
        if (len < 5) {
          if (moment.week !== '' && moment.day !== '') {
            this.ruleForm.send_rule.send_time.push(obj)
          } else {
            this.$message({
              showClose: true,
              message: '请输入推送时间',
              type: 'warning'
            })
          }
        } else {
          this.$message({
            showClose: true,
            message: '最多只能输入5个推送时间',
            type: 'warning'
          })
        }
      },
      // 删除一个推送时间
      reduceItemSend(index) {
        this.ruleForm.send_rule.send_time.splice(index, 1)
      },
      handleSuccess(response, file, fileList) {
        if (response.data.upload_flag === true) {
          this.banner = response.data.fileUrl
        } else {
          this.$message.error(response.msg)
        }
        this.$refs.upload.clearFiles()
      },
      handlePreview(file) {
        console.log(file)
      },
      handleExceed(files, fileList) {
        this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
      },
      beforeAvatarUpload(file) {
        console.log(file)
        const isJPG = file.type === 'image/jpeg' || file.type === 'image/png'
        const isLt2M = file.size / 1024 / 1024 < 2
        if (!isJPG) {
          this.$message.error('上传图片只能是JPG或者PNG格式!')
        }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 2MB!')
        }
        return isJPG && isLt2M
      },
      // 点击查看
      showBanner() {
        if (this.banner !== '') {
          this.bannerFlag = true
          document.body.style.overflow = 'hidden'
        } else {
          this.$message.warning('当前课程没有缩略图')
        }
      },
      cancelBanner() {
        this.bannerFlag = false
        document.body.style.overflow = ''
      },
      back() {
        window.history.go(-1)
      },
      // 删除题目
      removeSubject(item) {
        var index = this.testForm.essay_qu.indexOf(item)
        if (index !== -1) {
          this.testForm.essay_qu.splice(index, 1)
        }
      },
      // 删除答案
      removeAnswer(item, index, len) {
        // 隐藏添加按钮
        if (this.testForm.essay_qu[index].answer.length >= 10) {
          this.$set(this.showAnswer, index, true)
        }
        var arrValue = this.testForm.essay_qu[index].answer.indexOf(item)
        if (arrValue !== -1) {
          this.testForm.essay_qu[index].answer.splice(arrValue, 1)
        }
        // 传值ABC序列化
        for (let j = 0; j < this.testForm.essay_qu[index].answer.length; j++) {
          this.$set(this.testForm.essay_qu[index].answer[j], 'select_num', this.labelIndex(j))
        }
      },
      // 新增一道题
      addSubject(len) {
        if (len === 0) {
          this.$set(this.showAnswer, len, true)
          this.testForm.essay_qu.push({
            qu_title: '',
            analyze: '',
            right: [],
            answer: [{
              test_answer: '',
              select_num: 'A'
            }, {
              test_answer: '',
              select_num: 'B'
            }]
          })
        } else {
          this.$refs['testForm'].validate((valid) => {
            if (valid) {
              this.$set(this.showAnswer, len, true)
              this.testForm.essay_qu.push({
                qu_title: '',
                analyze: '',
                right: [],
                answer: [{
                  test_answer: '',
                  select_num: 'A'
                }, {
                  test_answer: '',
                  select_num: 'B'
                }]
              })
            } else {
              return false
            }
          })
        }
      },
      // 新增一个选项
      addAnswer(index, len) {
        var answerLen = this.testForm.essay_qu[index].answer.length
        if (this.testForm.essay_qu[index].answer[answerLen - 1].test_answer !== '') {
          const letter = this.labelIndex(len)
          this.testForm.essay_qu[index].answer.push({
            test_answer: '',
            select_num: letter
          })
          if (this.testForm.essay_qu[index].answer.length >= 10) {
            this.$set(this.showAnswer, index, false)
          }
        } else {
          this.$message.warning('请输入空白选项')
        }
      },
      labelIndex(index) {
        switch (index) {
          case 0:
            return 'A'
          case 1:
            return 'B'
          case 2:
            return 'C'
          case 3:
            return 'D'
          case 4:
            return 'E'
          case 5:
            return 'F'
          case 6:
            return 'G'
          case 7:
            return 'H'
          case 8:
            return 'I'
          case 9:
            return 'J'
          default:
            return '...'
        }
      },
      submitForm(formName) {
        this.$refs['ruleForm'].validate((valid) => {
          if (valid) {
            const timeArr = this.ruleForm.send_rule.send_time
            for (const time of timeArr) {
              if (time.week === '0' && time.day === '0') {
                this.$message.error('推送时间不能为孕0周，第0天')
                return false
              }
            }
            var testLength = this.testForm.essay_qu.length
            if (testLength > 0) {
              var testObj = this.testForm.essay_qu[testLength - 1]
              var titleFlag = !testObj.qu_title
              var analyzeFlag = !testObj.analyze
              var rightFlag = !testObj.right[0]
              var answerFlag = false
              for (const obj of testObj.answer) {
                if (obj.test_answer !== '') {
                  answerFlag = false
                  break
                } else {
                  answerFlag = true
                }
              }
              if (titleFlag && analyzeFlag && rightFlag && answerFlag) {
                this.list.base_info = this.ruleForm.base_info
                this.list.send_rule = this.ruleForm.send_rule
                this.list.send_rule.banner = this.banner
                this.list.essay_qu = []
                this.list.essay_content = this.$refs.ue.getUEContent()
                updateLesson(Object.assign({}, { 'essay_id': this.id, 'data': this.list })).then(response => {
                  if (response.data.execute_flag === true) {
                    this.$message.success('保存成功')
                  }
                })
              } else {
                this.$refs[formName].validate((valid) => {
                  if (valid) {
                    this.list.base_info = this.ruleForm.base_info
                    this.list.send_rule = this.ruleForm.send_rule
                    this.list.send_rule.banner = this.banner
                    this.list.essay_qu = this.testForm.essay_qu
                    this.list.essay_content = this.$refs.ue.getUEContent()
                    updateLesson(Object.assign({}, { 'essay_id': this.id, 'data': this.list })).then(response => {
                      if (response.data.execute_flag === true) {
                        this.$message.success('保存成功')
                      }
                    })
                  } else {
                    return false
                  }
                })
              }
            } else if (testLength === 0) {
              this.list.base_info = this.ruleForm.base_info
              this.list.send_rule = this.ruleForm.send_rule
              this.list.send_rule.banner = this.banner
              this.list.essay_qu = []
              this.list.essay_content = this.$refs.ue.getUEContent()
              updateLesson(Object.assign({}, { 'essay_id': this.id, 'data': this.list })).then(response => {
                if (response.data.execute_flag === true) {
                  this.$message.success('保存成功')
                }
              })
            }
          } else {
            return false
          }
        })
      }
    }
  }
</script>
